<template>
	<view class="all">
		<cu-custom bgColor="bg-gradual-pink" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">停车</block>
		</cu-custom>
		<view style="margin-top:50px;font-size: 20px;font-weight: 500;">
			请选择你想要停车的区域：
		</view>
		<view class="quyu">
			<button v-for="(item,index) in data" :key="index" class="cu-btn round bg-pink" @click="handle(item,index)"
				:style="{'background-color':index==ischeck?'blue':'pink'}">{{item.name}} {{item.counts}}</button>
		</view>
		<view
			style="margin-top: 50px;float: rigth;margin-right: 50px;display: inline-flex;align-items: center;justify-content: center;"
			v-if="statu">
			<text style="font-size: 20px;font-weight: 500;margin-left: 30px;">您已停车在{{wayinfo}}</text>
			<button class="cu-btn round bg-blue" @click="consoleway">取消停车</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				data: [],
				ischeck: 0,
				statu: 0,
				wayinfo: '',
				user: {},
				id: ''
			}
		},
		methods: {
			getData() {
				let that = this
				that.$https.get('/rest/categories').then(res => {
					that.data = res.data
					// that.data = that.data.map(value=>{
					// 	that.$set(value,'counts',value.number-value.count)
					// 	return value
					// })
					this.ischeck = res.data.length + 1
					const model = {}
					model.nickName = uni.getStorageSync('nickName', )
					that.$https.post(`/rest/cars`, model).then(result => {
						console.log(result, 'aini')
						if (result.data.length) {
							that.statu = result.data[0].statu
							that.wayinfo = result.data[0].wayinfo
							that.id = result.data[0]._id
							that.data.map((value, index) => {
								if (value.name == that.wayinfo) {
									that.ischeck = index
								}
							})
						} else {
							that.statu = 0
						}
					})
				})
			},
			handle(item, index) {
				let that = this
				uni.showModal({
					title: '停车',
					content: `确定要停放在${item.name}的区域上吗？`,
					cancelText: '取消',
					confirmText: '确定',
					success: res => {
						if (res.confirm) {
							that.ischeck = index
							const items = item
							items.count = items.count + 1
							items.counts = items.counts - 1
							that.$https.put(`/categories/${item._id}`, items).then(res => {
								that.user.statu = 1
								that.user.wayinfo = item.name
								const model = {}
								model.statu = 1
								model.nickName = uni.getStorageSync('nickName', )
								model.wayinfo = item.name
								that.$https.post(`/rest/car`, model).then(result => {
									that.getData()
								})
							})
						}
					}
				})
			},
			consoleway() {
				let that = this
				uni.showModal({
					title: '取消停车',
					content: '确定要取消停车吗？',
					cancelText: '取消',
					confirmText: '确定',
					success: res => {
						if (res.confirm) {
							let items = {}
							for (let i = 0; i < that.data.length; i++) {
								if (that.data[i].name == that.wayinfo) {
									items = that.data[i]
									items.count = items.count - 1
									items.counts = items.counts + 1
								}
							}
							that.$https.put(`/categories/${items._id}`, items).then(resda => {
								that.$https.delete(`/car/${that.id}`).then(result => {
									that.getData()
								})

							})
						}
					}
				})
			}
		},
		onLoad() {
			this.getData()
		}
	}
</script>

<style>
	.quyu {
		display: flex;
		justify-content: space-around;
		align-items: center;
		margin-top: 50px;
	}
</style>
